/*右下角弹出框*/
/*消息框整个div*/
#message-window {
		background-color: #FFF;
		border: 1px solid #DDDDDD;
		text-align: center;
		line-height: 40px;
		font-size: 12px;
		font-weight: bold;
		z-index:99;
		width: 280px;
		position:fixed!important;/*FF IE7*/
		position:absolute;/*IE6*/
		left: 100%;
		top: 100%;
}
 
#message-top{
	background:#F6F6F6;
	width: 100%;
	height: 40px;
	float:left;
}
.message-top-line{
	width: 100%;
	height: 2px;
	background: #438EB9;
	float:left;
	display: none;
}
 
/*消息提醒框标题*/
.message-top-title{
	text-align: left;
	float:left;
	padding-left:3px;
	width: 50%;
}
 
.message-top-close{
	text-align: right;
	height:100%;
	width: 48%;
	float:left;
}
 
/*关闭图片*/
.message-top-close-img{
	margin-top: 20px;
	margin-right:4px;
	display:none;
	-webkit-transition: 0.4s;
    -webkit-transition: -webkit-transform 0.4s ease-out;
    transition: transform 0.4s ease-out;
    -moz-transition: -moz-transform 0.4s ease-out;
}
 
/*设置关闭图片旋转*/
.message-top-close-img:hover{
	transform:rotate(360deg);
	-ms-transform:rotate(360deg); /* IE 9 */
	-webkit-transform:rotate(360deg); /* Opera, Chrome, and Safari */
}
 
/*消息框折叠*/
#message-window-open{
		display:block;
		color: #438EB9;
		margin-right:4px;
		font-size: 15px;
}
.message-content{
	float:left;
	width: 100%;
	height: 420px;
	margin-top:1px;
	display: none;
}

.group-name{
	text-align: left;
	list-style: none;
	height: 30px;
	border-bottom: 1px solid red;
	margin-bottom: 1px;
}

.group-name,.group-name-userLi-detail:HOVER{
	background: #F1F1F1;
}
.group-name-title{
	line-height: 30px;
	float: left;
}
.group-name-userLi{
	width: 100%;
	height:260px;
	overflow:auto;
	display: none;
}
.group-name-userLi-detail{
	text-align: left;
	list-style: none;
	height: 50px;
}
/********************************************************聊天对话窗口*****************************************************************/
.chat-li{
	background: #fff;
	text-align: left;
	float: left;
	width: 100%;
	height: 41px;
	margin-left:6px;
	border-bottom: 1px solid #D2D4D6;
	margin-bottom: 1px;
}
.chat-li:HOVER{
	background: #D2D4D6;
}
.chat-li-img{
	width: 40px;
	height: 40px;
	border-radius:50%; 
	float: left;
}
.chat-li-span{
	float: left;
}

.chat-window {
		background-color: #FFFFFF;
		border: 1px solid #CCCCCC;
		text-align: center;
		line-height: 40px;
		font-size: 12px;
		font-weight: bold;
		z-index:99;
		width: 580px;
		height: 506px;
		left:40%;/*FF IE7*/
		top: 20%;/*FF IE7*/
		margin-left:-150px!important;/*FF IE7 该值为本身宽的一半 */
		margin-top:-60px!important;/*FF IE7 该值为本身高的一半*/
		margin-top:0px;
		position:fixed!important;/*FF IE7*/
		position:absolute;/*IE6*/
}

.chat-bg {
		background:#000;
		width: 100%;
		height: 100%;
		left:0;
		top:0;/*FF IE7*/
		filter:alpha(opacity=30);/*IE*/
		opacity:0.3;/*FF*/
		z-index:2;
		position:fixed!important;/*FF IE7*/
		position:absolute;/*IE6*/
		_top:    expression(eval(document.compatMode &&
		            document.compatMode=='CSS1Compat') ?
		            documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
		            document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
}

/*窗口标题栏*/
.chat-top{
	background:#ECECEC;
	width: 100%;
	height: 65px;
}

/*消息提醒框标题*/
.chat-top-title{
	text-align: left;
	float:left;
	padding-left:3px;
	width: 50%;
	margin-top: 3px;
}

.chat-top-img{
	width: 50px;
	height: 50px;
	border-radius:50%; 
	float: left;
	margin-top: 5px;
}
.chat-top-img+span{
	font-size: 15px;
	margin-left: 5px;
	float: left;
	color: green;
	margin-top: 7px;
}

.chat-top-close{
	text-align: right;
	float:left;
	width: 48%;
}

/*关闭图片*/
.chat-top-close-img{
	margin-top: 10px;
	margin-right:4px;
	-webkit-transition: 0.4s;
    -webkit-transition: -webkit-transform 0.4s ease-out;
    transition: transform 0.4s ease-out;
    -moz-transition: -moz-transform 0.4s ease-out;
}

.chat-content{
	height:280px;
	overflow:auto;
}
.chat-content-li{
	font-size:13px;
	text-align:left;
	height: 70px;
	width: 560px;
	margin-bottom: 1px;
}
.chat-content-li-detail-content{
	float: left;
}

.chat-content-li-detail{
	background:#E2E2E2;
	height: 30px;
	margin-left: 6px;
	width: auto;
}
/*图像div*/
.chat-content-li-imgDiv{
	float: left;
	width: 45px;
	height: 70px;
}
/*图像*/
.chat-content-li-imgDiv img{
	width: 40px;
	height: 40px;
	border-radius:50%; 
	float: left;
	margin-top: 12px;
	margin-left: 3px;
}
.chat-content-li-info{
	margin-left: 6px;
	width: 400px;
	color: #B6B5B4;
}

/*右边，显示别人发的消息*/
.chat-content-li-right{
	color:green;
	font-size:13px;
	text-align:left;
	height: 70px;
	width: 560px;
	margin-bottom: 1px;
}
.chat-content-li-imgDiv-right{
	float: right;
	width: 45px;
	height: 70px;
}
.chat-content-li-imgDiv-right img{
	width: 40px;
	height: 40px;
	border-radius:50%; 
	float: right;
	margin-top: 12px;
	margin-right: 3px;
}
.chat-content-li-detail-content-right{
		float: right;
}
.chat-content-li-info-right{
	margin-left: 6px;
	width: 400px;
	text-align:right;
	color: #B6B5B4;
}

/*底部*/
.chat-bottom{
	border-top: 1px solid #FFFFFF;
	height: 30px;
	text-align: left;
}
.chat-sendMsg,.chat-closeMsg{
	width: 70px;
	height: 30px;
	font-size:15px;
	text-align:center;
	color: #fff;
	float:right;
	line-height: 30px;
	background: #5FB878;
	text-decoration:none;
	font-family:"宋体";
	margin-right: 5px;
}

.chat-closeMsg{
	float:left;
	margin-left: 400px;
}
.chat-sendMsg{
	margin-left: 0;
}


/*表情栏*/
.chat-bottom-expression{
	float: left;
	width: 100%;
	height: 40px;
	background: #FBFBFB;
}

/*消息输入栏*/
.chat-bottom-content{
	float: left;
	width: 100%;
	height: 80px;
	border:1px solid #E2E2E2;
	overflow: auto;
	font-size: 14px;
	outline:none;
	word-wrap:break-word;  /*遇到空格整个单词显示不完就自动换行到下一行*/
	word-break:break-all;  /*如果一行没有空格就到头截断单词换行*/
}

.chat-bottom-content:empty:before{
    content: attr(placeholder);
    color: #CCCCCC;
}
.chat-bottom-content:focus:before{
 	content:none;
}

/*发送、关闭按钮*/
.chat-bottom-btn{
	margin-top:2px;
	float: left;
	width: 100%;
	background: #FFFFFF;
}
/********************************************************聊天对话窗口*****************************************************************/
